/**
 * 自定义时间选择组件，支持周选择以及季度选择
 * by LHC
 * create 2020-06-19
 */
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { QuestionCircleOutlined } from '@ant-design/icons';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { DatePicker, Tooltip, message } from 'antd';
import moment from 'moment';
import { FormItemLayout, titleStyle, toolTipStyle } from '../formPub';
const { WeekPicker } = DatePicker;
class SimpleWeekC extends Component {
  // props默认值
  static defaultProps = {
    title: '',
    placeholder: '请选择日期',
    helper: '',
    onChange: () => {},
    onRef: () => {}, // 本组件的引用
  };

  componentDidMount() {
    // 父组件对本组件的引用
    this.props.onRef(this);
  }

  // 非初始化状态下更改时间(供父组件调用)
  setDate = (value) => {
    let that = this;
    const { dateBeginKey, dateEndKey, dataIndex } = that.props;
    let weekOfday = parseInt(moment(value).format('d')); // 计算今天是这周第几天
    if (weekOfday === 0) {
      weekOfday = 7;
    }
    const last_monday = moment(value)
      .subtract(weekOfday - 1, 'days')
      .format('YYYY/MM/DD'); // 周一日期
    const last_Friday = moment(value)
      .add(7 - weekOfday - 2, 'days')
      .format('YYYY/MM/DD'); // 周五日期
    message.warning(`报告周期:${last_monday}至${last_Friday}`);
    let o = {};
    o[dateBeginKey] = moment(last_monday).format('YYYY-MM-DD');
    o[dateEndKey] = moment(last_Friday).format('YYYY-MM-DD');
    o[dataIndex] = value;
    that.props.form.setFieldsValue(o);
  };

  // 禁选日期设定
  disabledDate = (value) => {
    const { disableBegin, disableEnd } = this.props;
    if ((disableBegin === '' || disableBegin === undefined) && (disableEnd === '' || disableEnd === undefined)) {
      return value.valueOf() > moment().valueOf();
    }

    if (disableBegin === null && disableEnd === null) return true;

    return value.valueOf() < disableBegin.valueOf() || value.valueOf() > disableEnd.valueOf();
  };
  //时间change
  onChange = (date, dateString) => {
    let that = this;
    const { dateBeginKey, dateEndKey } = that.props;
    let weekOfday = parseInt(moment(date).format('d')); // 计算今天是这周第几天
    if (weekOfday === 0) {
      weekOfday = 7;
    }
    const last_monday = moment(date)
      .subtract(weekOfday - 1, 'days')
      .format('YYYY/MM/DD'); // 周一日期
    const last_Friday = moment(date)
      .add(7 - weekOfday - 2, 'days')
      .format('YYYY/MM/DD'); // 周五日期
    message.warning(`报告周期:${last_monday}至${last_Friday}`);
    this.props.onChange({ beginDate: moment(last_monday).format('YYYY-MM-DD'), endDate: moment(last_Friday).format('YYYY-MM-DD') });
    let o = {};
    o[dateBeginKey] = moment(last_monday).format('YYYY-MM-DD');
    o[dateEndKey] = moment(last_Friday).format('YYYY-MM-DD');
    that.props.form.setFieldsValue(o);
  };
  render() {
    const { extraLayout, helper, title, form, dataIndex, initialValue, onChange, placeholder, dateBeginKey, dateEndKey } = this.props;
    const { getFieldDecorator } = form;
    let layout = extraLayout ? extraLayout : FormItemLayout;
    return (
      <Form.Item
        {...layout}
        label={
          helper ? (
            <span style={titleStyle}>
              {title}&nbsp;
              <Tooltip title={helper}>
                <QuestionCircleOutlined style={toolTipStyle} />
              </Tooltip>
            </span>
          ) : (
            <span style={titleStyle}>{title}</span>
          )
        }
      >
        {getFieldDecorator(dataIndex, {
          initialValue,
          rules: this.props.rules ? this.props.rules : [],
        })(<WeekPicker onChange={this.onChange} placeholder={placeholder} disabledDate={this.disabledDate} style={{ width: '100%' }} />)}
        {getFieldDecorator(dateBeginKey, {})(<span></span>)}
        {getFieldDecorator(dateEndKey, {})(<span></span>)}
      </Form.Item>
    );
  }
}

// props类型
SimpleWeekC.propsTypes = {
  form: PropTypes.object, // form对象
  title: PropTypes.string, // 显示名称
  dataIndex: PropTypes.string, // Form识别的Item ID
  initialValue: PropTypes.string, // 初始默认值
  placeholder: PropTypes.string, // 占位符
  onChange: PropTypes.func, // 输入框内容变化时的回调 返回 ({beginDate:xxxxx,endDate:xxxx})
  helper: PropTypes.oneOfType([
    // 提示帮助信息
    PropTypes.string,
    PropTypes.element,
  ]),
  onRef: PropTypes.func, // 本组件的引用（可用来父组件调用内部方法）
  dateBeginKey: PropTypes.string, //用于标识所选报告开始时间的key
  dateEndKey: PropTypes.string, //用于标识所选报告结束时间的key
};

export default SimpleWeekC;
